// pages/index/index.js
import util from '../../utils/index'
import config from '../../utils/config'
let app = getApp()
Page({

  /**
   * 页面的初始数据
   */
  data: {
    page: 1,
    days: 3,
    pageSize: 4,
    totalSize: 0,
    hasMore: true,
    articleList: [], // 存放文章列表数据
    defaultImg: config.defaultImg
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    this.requestArticle()
  },

  requestArticle() {
    util.request({
      url: 'list',
      data: {
        tag: '微信热门',
        start: this.data.page || 1,
        days: this.data.days || 3,
        pageSize: this.data.pageSize,
        langs: 'en'
      },
      mock: true
    }).then(res => {
      // console.log(res);
      if (res && res.status === 0 && res.data && res.data.length) {
        let articleData = res.data
        // 格式化数据--如果有今天的时间，就处理
        let formatData = this.formatArticleData(articleData)
        // this.setData({
        //   articleList: formatData
        // })
        // 每次请求回来的都是重复的数据，但是把它们拼接在一起
        this.renderArticle(formatData)

        // console.log(this.data.articleList);
      }
      // 如果不是第一页的数据,后端返回的数据已经空了
      else if (this.data.page !== 1 && res.data && res.data.length === 0) {
        this.setData({
          hasMore: false
        })
      }
    })
  },
  // 分页拼接数据 
  renderArticle(data) {
    if (data && data.length) {
      let newList = this.data.articleList.concat(data)
      this.setData({
        articleList: newList
      })
    }
  },

  // 格式化文章列表
  formatArticleData(data) {
    let formatData = undefined
    if (data && data.length) {
      formatData = data.map((group) => {
        // 格式化日期
        group.formatDate = this.dateConvert(group.date)
        
        if (group && group.articles) {
          let formatArticleItems = group.articles.map((item) => {
            // 判断是否已经访问过
            item.hasVisited = this.isVisited(item.contentId)
            return item
          }) || []
          group.articles = formatArticleItems

        }
        return group
      })
    }
    return formatData
  },
  // 检验日期，如果是当天，就返回‘今日’
  dateConvert(dateStr) {
    if (!dateStr) return '';
    let today = new Date(),
      todayYear = today.getFullYear(),
      todayMonth = ('0' + (today.getMonth() + 1)).slice(-2),
      todayDay = ('0' + today.getDate()).slice(-2);
    let todayFormat = `${todayYear}-${todayMonth}-${todayDay}`
    let convertStr = ''
    if (dateStr === todayFormat) {
      convertStr = '今日'
    } else {
      convertStr = dateStr
    }
    return convertStr
  },
  // 校验文章是否已阅读
  isVisited(contentId) {
    let visitedArticles = app.globalData && app.globalData.visitedArticles || ''
    return visitedArticles.indexOf(contentId) > -1
  },
  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {

  },

  // 去详情页
  showDetail(e) {
    // console.log(e);
    let item = e.currentTarget.dataset.item
    let contentId = item.contentId
    // 已阅读
    this.markRead(contentId)
    wx.navigateTo({
      url: `/pages/detail/detail?contentId=${contentId}`
    })
  },


  markRead(contentId) {
    util.getStorageData('visited', (data) => {
      console.log(data);
      let newStorage = data
      if (data) {
        // 如果当前文章 contentId 不存在，也就是还没阅读，那就存进去
        if (data.indexOf(contentId) === -1) {
          newStorage = `${data},${contentId}`
        }
      } else {
        // 一篇已阅读的文章都没有
        newStorage = `${contentId}`
      }

      /**
       * 如果data（老数据）和newStorage（新数据）不一样，说明已阅读的记录发生了变化
       * 就把新的记录重新存进缓存，和globalData
      */
      if (data !== newStorage) {
        if (app.globalData) {
          app.globalData.visitedArticles = newStorage
        }
        util.setStorageData('visited', newStorage, () => {
          // 重置已阅读的效果
          this.resetArticles()
        })
      }
    })
    console.log(this.data.articleList);
  },

  resetArticles() {
    let old = this.data.articleList
    let newArticles = this.formatArticleData(old)
    this.setData({
      articleList: newArticles
    })
  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {
    this.setData({
      page: 1,
      hasMore: true,
      articleList: []
    })
    this.requestArticle()
  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {
    // 假装到第三页就没数据了
    if (this.data.page === 3) {
      this.setData({
        hasMore: false
      })
    }
    if (this.data.hasMore) {
      let nextPage = this.data.page + 1
      this.setData({
        page: nextPage
      })
      this.requestArticle()
    }
  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {

  }
})